<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>插入排序演示</title>
    <link rel="stylesheet" href="styles.css">
    <link rel="stylesheet" href="insertion-sort.css">
</head>
<body>
    <div class="container">
        <div class="header">
            <a href="index.html" class="back-button">← 返回首页</a>
            <h1>🎴 插入排序 🎴</h1>
        </div>
        
        <div class="game-controls">
            <button id="generateNew">生成新数字</button>
            <button id="startSort">开始排序</button>
            <button id="nextStep">下一步</button>
            <button id="reset">重置</button>
        </div>

        <div class="numbers-container" id="numbersContainer">
        </div>

        <div class="explanation">
            <h3>📝 说明：</h3>
            <p>插入排序就像整理扑克牌，拿起一张新牌，找到合适的位置插入进去！</p>
            <div id="currentStep">准备开始...</div>
        </div>
    </div>
    <script src="insertion-sort.js"></script>
</body>
</html> 